package com.hc.pokemen.feature_pokemen.presentation.pokemon_list


import androidx.compose.foundation.Image
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Spacer
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.height
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.statusBarsPadding

import androidx.compose.material3.MaterialTheme
import androidx.compose.material3.Surface
import androidx.compose.runtime.Composable
import androidx.compose.runtime.LaunchedEffect
import androidx.compose.ui.Modifier
import androidx.compose.ui.res.painterResource
import androidx.compose.ui.tooling.preview.Preview
import androidx.compose.ui.unit.dp
import androidx.hilt.navigation.compose.hiltViewModel
import androidx.navigation.NavController
import com.hc.pokemen.R
import com.hc.pokemen.feature_pokemen.domain.entity.PokemonListItem
import com.hc.pokemen.feature_pokemen.presentation.pokemon_list.components.PokemonList
import com.hc.pokemen.feature_pokemen.presentation.pokemon_list.components.SearchBar
import com.hc.pokemen.feature_pokemen.presentation.util.Screen
import com.hc.pokemen.ui.theme.PokemenTheme

typealias OnPokemonListScreenEvent = (event: PokemonListScreenEvent) -> Unit


@Preview
@Composable
fun PokemonListScreenPreview() {
    PokemenTheme {

        PokemonListScreen(
            state = PokemonListScreenState(
                pokemonList = arrayListOf(
                    PokemonListItem(
                        "1",
                        "https://raw.githubusercontent.com/PokeAPI/sprites/master/sprites/pokemon/1.png",
                        1
                    ),
                    PokemonListItem(
                        "2",
                        "https://raw.githubusercontent.com/PokeAPI/sprites/master/sprites/pokemon/2.png",
                        2
                    ),
                    PokemonListItem(
                        "3",
                        "https://raw.githubusercontent.com/PokeAPI/sprites/master/sprites/pokemon/3.png",
                        3
                    ),
                    PokemonListItem(
                        "4",
                        "https://raw.githubusercontent.com/PokeAPI/sprites/master/sprites/pokemon/4.png",
                        4
                    ),


                    )
            ), onEvent = {})
    }
}

@Composable
fun PokemonListScreen(controller: NavController, vm: PokemonListViewModel = hiltViewModel()) {
    LaunchedEffect(Unit) {
        vm.effect.collect {
            when (it) {
                is PokemonListEffect.GoPokemonDetail -> {
                    controller.navigate(Screen.PokemonDetail.createRoute(it.dominantColor, it.name))
                }
            }
        }
    }
    PokemonListScreen(vm.state) {
        vm.onEvent(it)
    }
}

@Composable
fun PokemonListScreen(state: PokemonListScreenState, onEvent: OnPokemonListScreenEvent) {
    Surface(modifier = Modifier.fillMaxSize().statusBarsPadding(), color = MaterialTheme.colorScheme.background) {
        Column {
            Spacer(modifier = Modifier.height(20.dp))
            //图标
            Image(
                painter = painterResource(id = R.drawable.ic_international_pok_mon_logo),
                contentDescription = null,
                modifier = Modifier.fillMaxWidth()
            )
            //搜索框
            SearchBar(
                modifier = Modifier
                    .fillMaxWidth()
                    .padding(16.dp),
                hint = "Search...",
                onSearchChange = {
                    onEvent(PokemonListScreenEvent.SearchResultChange(it))
                })
            Spacer(modifier = Modifier.height(16.dp))
            //列表
            PokemonList(state = state, onEvent = onEvent)
        }
    }
}